<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <title>树形菜单示例</title>
  <style type="text/css">
    ul>li{
      list-style: none;
    }
    /* 可展开*/
    .switch-open
    {
      margin-left:-12px;
      border:6px solid transparent;
      display:inline-block;
      width:0px;
      height:0px;
      border-top-color: black;
    }
    /* 展开完毕*/
    .switch-close
    {
      margin-left:-12px;
      border:6px solid transparent;
      display:inline-block;
      width:0px;
      height:0px;
      border-left-color: black;
      margin-bottom: 2px;
    }
    /* 改变CheckBox样式*/
    input[type='checkbox']{
      width: 20px;
      height: 20px;
      -webkit-appearance:none;
      -moz-appearance: none;
      border: 1px solid #c9c9c9;
      border-radius: 3px;
      outline: none;
      color:white;
      text-align: center;
    }
    input[type='checkbox']:before
    {
      content: '√ ';
      color:transparent;
    }
    input[type=checkbox]:checked{
      background-color: #30add6;
    }
    input[type=checkbox]:checked:before{
      content: '√';
      color:white;
      font-weight: bold;
    }
  </style>
</head>





<body>

<div>
  <ul id="treeDemo" class="ztree"></ul>
</div>

<!--<form class="am-form">-->
  <!--<fieldset>-->
    <!--<div class="warp">-->
      <!--<ul id="container" class="ztree">-->
      <!--</ul>-->
    <!--</div>-->
  <!--</fieldset>-->
<!--</form>-->

<!--<script src="http://cdn.amazeui.org/amazeui/2.7.2/js/amazeui.widgets.helper.min.js"></script>-->
<!--&lt;!&ndash;[if lt IE 9]>-->
<!--<script src="http://libs.baidu.com/jquery/1.11.1/jquery.min.js"></script>-->
<!--<script src="http://cdn.staticfile.org/modernizr/2.8.3/modernizr.js"></script>-->
<!--<script src="__ASSETS__/js/amazeui.ie8polyfill.min.js"></script>-->
<!--<![endif]&ndash;&gt;-->

<!--&lt;!&ndash;[if (gte IE 9)|!(IE)]>&lt;!&ndash;>-->
<!--<script src="__ASSETS__/js/jquery.min.js"></script>-->
<!--&lt;!&ndash;<![endif]&ndash;&gt;-->
<!--<script src="__ASSETS__/js/amazeui.min.js"></script>-->

<!--<script src="__ASSETS__/js/jquery.cookie.min.js"></script>-->
<!--&lt;!&ndash;<script src="__ASSETS__/js/jquery.min.js"></script>&ndash;&gt;-->
<!--&lt;!&ndash;<script src="//cdn.bootcss.com/jquery-cookie/1.4.1/jquery.cookie.min.js"></script>&ndash;&gt;-->
<!--<script src="__ASSETS__/js/common.js"></script>-->
<script src="http://cdn.amazeui.org/amazeui/2.7.2/js/amazeui.widgets.helper.min.js"></script>
<!--[if lt IE 9]>
<script src="http://libs.baidu.com/jquery/1.11.1/jquery.min.js"></script>
<script src="http://cdn.staticfile.org/modernizr/2.8.3/modernizr.js"></script>
<script src="__ASSETS__/js/amazeui.ie8polyfill.min.js"></script>
<![endif]-->

<!--[if (gte IE 9)|!(IE)]><!-->
<script src="__ASSETS__/js/jquery.min.js"></script>
<!--<![endif]-->
<script src="__ASSETS__/js/amazeui.min.js"></script>

<!--<script src="//cdn.bootcss.com/jquery-cookie/1.4.1/jquery.cookie.min.js"></script>-->
<script src="__ASSETS__/js/jquery.cookie.min.js"></script>
<script src="__ASSETS__/js/common.js"></script>

<link rel="stylesheet" href="__ASSETS__/css/demo.css" type="text/css">
<link rel="stylesheet" href="__ASSETS__/css/zTreeStyle/zTreeStyle.css" type="text/css">
<!--<script src="__ASSETS__/js/jquery.min.js"></script>-->
<script type="text/javascript" src="__ASSETS__/js/jquery.ztree.core.min.js"></script>

<script src="__ASSETS__/js/usertree3.js"></script>


</body>
</html>